<template>
    <div>
        <h3>我的评论</h3>
        <mineReturn title="我的评价"  />

        <ul class="show">
            <li class="showl" v-for="item in data" :key="item.id" @click="clickHandler(item.id)">
                <div class="left">
                    <van-image width="6rem" height="10rem" fit="cover" :src="item.src" />
                </div>
                <div class="right" >
                    <div >
                        <span>{{ item.name }}</span>
                        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                        <span>{{ item.master }}</span>
                    </div>
                    <div>
                        <p>我的评价：</p>
                        <p>{{ item.critic }} </p>
                    </div>
                </div>
            </li>
        </ul>

    </div>
</template>

<script>
// import {returnBefore} from "@/components/returnBefore"
import { mycritic } from '@/api/mineApi';
export default {
    data(){
        return {
            data:[]
        }
    },
    async created(){
        let a = await mycritic()
        console.log(a)
        this.data = a
    },
    methods:{
        clickHandler(id) {
            this.$router.push(`/drama/${id}`)
        }
    }
} 
</script>

<style lang="scss" scoped>
// .show {
//     width: 100%;
//     display: flex;
//     flex-direction: row;
//     justify-content: space-around;
//     flex-wrap: wrap;
// }
.showl {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
div{
    padding: 5px;
}
</style>